<template>
  <view v-if="showAuth" class="userAuth">
    <view class="page-login">
      <view class="name"> 登录劳动力信息系统 </view>
      <view class="desc"> 全国领先的专业互联网求职平台</view>
      <u-button
        class="btn-auth"
        type="primary"
        shape="circle"
        @click="clickBtn"
        :hairline="true"

        >一键授权登录</u-button>
		<view class="agreement">
			<!-- <u-radio-group v-model="value">
						<u-radio 
						@change="radioChange" 
						v-for="(item, index) in list" :key="index" 
						:name="item.name"
						:disabled="item.disabled"
						>
						{{item.name}}
						</u-radio>
					</u-radio-group> -->
					
					
			<u-checkbox-group >
						<u-checkbox 
							@change="checkboxChange" 
							v-model="item.checked" 
							v-for="(item, index) in list" :key="index" 
							:name="item.name"
						>{{item.name}}</u-checkbox>
					</u-checkbox-group>
			<view class="" style="color: #1684FC;" @click="goWebView('用户协议')">《用户协议》</view>
			<view class="">和</view>
			<view class="" style="color: #1684FC;"  @click="goWebView('隐私政策')">《隐私政策》</view>
			
			<!-- <u-radio v-model="value">
				我已阅读并同意
				</u-radio>
				<view class="" style="color: #1684FC;" @click="userAgreement()">用户协议、</view>
				<view class="" style="color: #1684FC;"  @click="privacyPolicy()">隐私政策</view> -->
			</view>
      <view v-if="showPhoneMask" class="mask">
        <view class="cont">
          <view class="tit"> 提示 </view>
          <view class="content">
            为了向您提供更好的服务<br />
            我们需要获取您的手机号！
          </view>
          <u-button
            open-type="getPhoneNumber"
            @getphonenumber="onGetPhoneNumber"
            class="btn"
            type="primary"
            shape="circle"
          >
            获取手机号</u-button
          >
        </view>
      </view>
    </view>
  </view>
</template>
<script>
import WXBizDataCrypt from "../../../commonJS/WXBizDataCrypt.js";
import api from "../../../api/routes.js";
export default {
  data() {
    return {
      showAuth: true,
      showPhoneMask: false,
      infors: {},
      canIUse: uni.canIUse("button.open-type.getUserInfo"),
      canIGetUserProfile: true, //微信登录新旧版本 true是新
	  url:'https://recruit-oss.oss-cn-beijing.aliyuncs.com/recruit/html/qmyg-yhxy.html',
	  url1:'https://recruit-oss.oss-cn-beijing.aliyuncs.com/recruit/html/qmyg-yszc.html',
	  value:'',
	  list: [
			{
				name: '我已阅读并同意',
				disabled: false
			},
		],
    };
  },
  onLoad() {},

  methods: {
	checkboxChange(e) {
		this.value=e.value
		
	},
			
	  goWebView(name){
		  console.log(name,'用户协议');
		  if(name=="用户协议"){
			  uni.navigateTo({
			  	// 我的/帮助中心
			    url: `/package/pages/webView/webView?name=用户协议&url=https://web.xujiekeji.com/qmyg-yhxy.html`,
			  });
		  }else{
			  uni.navigateTo({
			  	// 我的/帮助中心
			    url: `/package/pages/webView/webView?name=隐私协议&url=https://web.xujiekeji.com/qmyg-yszc.html`,
			  });
		  }
		  
	  },
    showMask() {
      this.showAuth = true;
    },

    login(res,phone) {
      console.log(res,'11========');
      this.$myRequest({
        url: api.miniLogin,
        method: "POST",
        data: {
          nickname: this.infors.nickName,
          avatar: this.infors.avatarUrl,
          openid: res.openid,
          unionid: res.unionid,
          phoneNumber: phone,
          sex: this.infors.gender,
          fromMbId: "",
        },
      }).then((res) => {
        console.log(res);
        if (res.data.code == 0) {
          this.showPhoneMask = false;
          this.showAuth = false;
          console.log(res.data,"登录12");
          uni.setStorageSync("member", res.data.member);
          uni.setStorageSync("token", res.data.token);

          let pages = getCurrentPages(); // 当前页面
          let beforePage = pages[pages.length - 2]; // 上一页
          uni.navigateBack({
            success: function () {
              beforePage.onLoad(); // 执行上一页的onLoad方法
            },
          });
        }
      });
    },
    onGetPhoneNumber(PhoneNumber1) {
      console.log(PhoneNumber1,777777);
      uni.login({
        provider: "weixin",
        success: (res) => {
          this.$myRequest({
            url: api.jscode2session,
            method: "GET",
            data: {
              code: res.code,
            },
          }).then((res1) => {
            let { session_key, unionid, appid, openid, phoneNumber } =
              res1.data.jsonObject;

            console.log(session_key, unionid, appid, openid, phoneNumber,11111);

            if (!phoneNumber) {
              let pc = new WXBizDataCrypt(appid, session_key);
              let data = pc.decryptData(
                PhoneNumber1.detail.encryptedData,
                PhoneNumber1.detail.iv
              );
              console.log(data,22222222);
              this.login(res1.data.jsonObject,data.phoneNumber);
            } else {
              this.login(res1.data.jsonObject);
            }
          });
        },
        fail: (res) => {
          // 拒绝授权
          wx.showToast({
            title: "您拒绝了请求",
            icon: "error",
            duration: 2000,
          });
          return;
        },
      });
    },

    clickBtn() {
		// uni.getUserProfile用于获取用户信息
		if(this.value==true){
			uni.getUserProfile({
			  desc: "获取你的昵称、头像、地区及性别",
			  success: (res) => {
			    this.infors = res.userInfo;
			    this.showPhoneMask = true;
			  },
			  fail: (res) => {
			    //拒绝授权
			    // wx.showToast({
			    // 	title: '您拒绝了请求,不能正常使用小程序',
			    // 	icon: 'error',
			    // 	duration: 2000
			    // });
			    return;
			  },
			});
		}else{
			wx.showToast({
				title: '请先勾选同意相关用户协议及隐私政策',
				icon: 'none'
			})
			console.log('未同意协议');
		}
      
    },
	
  },
};
</script>

<style lang="scss" scoped>
.userAuth {
  // bottom: 0;
  // right: 0;
  // position: fixed;
  // z-index: 5;
  // top: 0px;
  // left: 0px;
  // background-color: rgba(0, 0, 0, 0);

  .mask {
    bottom: 0;
    right: 0;
    position: fixed;
    z-index: 7;
    top: 0px;
    left: 0px;
    background-color: rgba(0, 0, 0, 0.6);

    .cont {
      position: absolute;
      width: 80%;
      height: 190px;
      border-radius: 5px;
      background: #fff;
      left: 10%;
      top: 50%;
      margin-top: -90px;
      text-align: center;
      padding: 20px;
      font-size: 18px;
      font-weight: bold;

      .content {
        font-weight: normal;
        padding: 20px 0;
        font-size: 14px;
      }
    }
  }
  .name {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 40% 0 0;
  }
  .desc {
    font-size: 12px;
    text-align: center;
    padding: 10px;
    color: #666;
  }
  .btn-auth {
    width: 90%;
    display: block;
    margin: 10px auto;
  }

  // .btn-auth {
  // 	width: 100%;
  // 	height: 100%;
  // 	// background: orange;
  // 	opacity: 0;
  // 	top: 0;
  // 	bottom: 0;
  // 	left: 0;
  // 	right: 0;
  // 	position: absolute;
  // 	z-index: 6;
  // }
}
.agreement{
	display: flex;
	align-items: center;
	justify-content: center;
}
</style>
